$.ajaxSetup({
    async: false
});

var groupData = [];
var str = "";

loadGroup();

function loadGroup() {
    $.post("common/groupList", {
        parentId: 0
    }, function (result) {
        groupData = result;
    });
}

var arr = [
    {
        name: "所有文件",
        id: 0,
        children: groupData
    }
];

paintingTree(arr);

function paintingTree(arr) {
    if (arr[0]["pId"] !== undefined) {
        arr = removeEmptyFromPaintData(arr)
    }

    createTree(arr);

    $("#tree").hide();
    $("#tree").html(str);
    $("[open=true]").each(function () {
        $(this).next().show()
    });
    $("[open=false]").each(function () {
        $(this).next().hide()
    });
    $(document).on("click", ".close", function () {
        $(this).parent().next().hide()
        $(this).addClass("open").removeClass("close")
    });
    $(document).on("click", ".open", function () {
        $(this).parent().next().show()
        $(this).addClass("close").removeClass("open")
    });
    $("#tree").show();
}

//渲染树
function createTree(arr) {
    var children = arr;
    str += "<ul>";
    for (var j = 0; j < children.length; j++) {
        str += "<li>";
        /*if (children[j]["children"]) {
            if (children[j]["open"]) {
                str += "<div open='true'><span class='close'></span><span class='openTrue' onclick='openDialog(this," + children[j]["id"] + ")'>" + children[j]["name"] + "</span></div>";
            } else {
                str += "<div open='false'><span class='open'></span><span class='openTrue' onclick='openDialog(this," + children[j]["id"] + ")'>" + children[j]["name"] + "</span></div>";
            }
        } else {
            str += "<div><span class='leaf'></span><span class='leafName' onclick='openDialog(this," + children[j]["id"] + ")'>" + children[j]["name"] + "</div>";
        }*/

        if (children[j]["level"] === 3) {
            str += "<div><span class='leaf'></span><span class='leafName' onclick='openDialog(this," + children[j]["id"] + ")'>" + children[j]["name"] + "</div>";
        } else {
            if (children[j]["id"] === 0) {
                str += "<div class='checkDiv'>";
            } else {
                str += "<div>";
            }
            str += "<span class='close'></span><span class='openTrue' onclick='openDialog(this," + children[j]["id"] + ")'>" + children[j]["name"] + "</span></div>";
        }

        createTree(children[j]["children"]);
        str += "</li>"
    }
    str += "</ul>";
}

//把简单的数据转化成渲染数据
function createPaintDataFromSimpleData(zNodes, Nodes) {
    for (var i = 0; i < zNodes.length; i++) {
        if (!!zNodes[i]) {
            zNodes[i]["children"] = [];
            for (var j = 0; j < Nodes.length; j++) {
                if (!!Nodes[j]) {
                    if (Nodes[j]["pId"] === zNodes[i]["id"]) {
                        if (Nodes[j]) {
                            zNodes[i]["children"].push(Nodes[j])
                            Nodes[j] = ""
                        }
                    }
                }
            }
            if (zNodes[i]["children"].length === 0) {
                zNodes[i]["children"] = false
            } else {
                createPaintDataFromSimpleData(zNodes[i]["children"], zNodes)
            }
        }
    }
    return zNodes;
}

//对渲染数据清除空元素
function removeEmptyFromPaintData(nodes) {
    console.log('clear nothing');
    var data = createPaintDataFromSimpleData(nodes, nodes);
    var arr = [];
    for (var i = 0; i < data.length; i++) {
        if (!!data[i]) {
            arr.push(data[i])
        }
    }
    return arr;
}

function openDialog(self, id) {
    // 先清除所有的颜色样式
    $('.checkDiv').each(function () {
        $(this).removeClass('checkDiv');
    });

    $(self).addClass('checkDiv');

    $('#baseBody').prop('src', 'backend/file/list?groupId=' + id);
}